<template>
  <div class="app-container">
    <div class="filter-container">

    </div>
    <div>
      <el-table
        border
        :data="excelListData"
        :loading="tableloading"
        width="40%"
      >
        <el-table-column
          prop="goodsName"
          label="兑换券名称"
          width="150"
        ></el-table-column>
        <el-table-column
          label="更新时间"
          align=center
          width="104"
        >
          <template slot-scope="scope">
            {{formatterTime(scope.row)}}
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-upload
              class="upload-demo"
              :action="uploadUrl"
              name="excelFile"
              :on-success="handleAvatarSuccess"
              :file-list="fileList"
              :data="uploadData"
              :show-file-list="false"
              :headers="imgHeaders"
            >
              <el-button
                size="small"
                type="primary"
                @click="uploadData.goodsId = scope.row.goodsId"
              >选择Excel</el-button>
            </el-upload>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import { fetchExchangeCodeStatus, fetchFindExchangeCode } from "@/api/table";
import { formatDateTime } from "@/utils/common";
import { getToken } from "@/utils/auth";
export default {
  data() {
    return {
      tableloading: false,
      excelListData: [],
      fileList: [],
      showUploadDialog: true,
      uploadUrl: "",
      uploadData: {
        goodsId: ""
      },
      imgHeaders: {
        Authorization: ""
      }
    };
  },
  mounted() {
    this.getExchangeCodeList();
    //上传链接
    this.uploadUrl = process.env.BASE_API + "ms/update/exchangeCodeStatus";
    this.imgHeaders.Authorization = getToken();
  },
  methods: {
    getGoodsId(e) {
      this.uploadData.goodsId = e;
    },
    handleAvatarSuccess(res, file, fileList) {
      if (res.status === 200) {
        this.getExchangeCodeList();
        this.$message.success("上传成功！");
      } else {
        this.$message.error(res.msg);
      }
    },
    //时间格式化
    formatterTime(row) {
      if (row.updateTime !== undefined) {
        return formatDateTime(row.updateTime);
      } else {
        return "";
      }
    },
    async getExchangeCodeList() {
      const excel = await fetchFindExchangeCode();
      this.excelListData = [];
      excel.data.forEach(item => {
        const list = {};
        list.goodsName = item.goodsName;

        if (item.updateTime == undefined) {
          list.updateTime = "";
        } else {
          list.updateTime = item.updateTime;
        }
        list.goodsId = item.goodsId;
        this.excelListData.push(list);
      });
    }
  }
};
</script>
